<template>
	<view class="page">
		<!-- 选择工种 -->
		<view class="gongzhong_class">
			选择工种：<text style="font-weight: bold;">{{form.taskTypeName}}</text>
		</view>
		<!-- 表单 -->
		<view class="wrap">
			<u-form :model="form" :rules="rules" ref="uForm" :border-bottom="false" :label-style="{fontSize:'26rpx'}"
				label-width="130rpx">
				<u-form-item label="工地位置" :border-bottom="false">
					<u-input border placeholder="请输入工地位置" v-model="form.taskAddress" type="text"></u-input>
				</u-form-item>

				<u-form-item label="联系人" :border-bottom="false">
					<u-input border placeholder="请输入联系人" v-model="form.contacts" maxlength="12" type="text"
						:clearable="false">
					</u-input>
				</u-form-item>

				<u-form-item label="联系方式" :border-bottom="false">
					<u-input border placeholder="请输入联系方式" v-model="form.mobile" type="number" maxlength="11"
						:clearable="false">
					</u-input>
				</u-form-item>


				<u-form-item label="预算(元)" :border-bottom="false">
					<u-input border placeholder="请输入预算(元)" v-model="form.budget" type="number" maxlength="6"
						:clearable="false">
					</u-input>
				</u-form-item>

				<u-form-item label="工期(天)" :border-bottom="false">
					<u-input border placeholder="请输入工期(天)" v-model="form.duration" type="number" maxlength="4"
						:clearable="false">
					</u-input>
				</u-form-item>

				<u-form-item label="招工要求" :border-bottom="false">
					<u-input type="textarea" height='200' border placeholder="请描述一下所需人才的要求..."
						v-model="form.introduction" :show-confirm-bar="false" />
				</u-form-item>
				<u-form-item label="工地图片" :border-bottom="false">
					<u-upload ref="uUpload" width="160" height="160" :action="action" max-count="4"
						:show-progress="false">
					</u-upload>
					<view style="font-size: 20rpx;color: #999;">至多4张图片</view>
				</u-form-item>
			</u-form>
			<view style="margin:10rpx 50rpx;text-align: center;">
				<u-button shape="circle" type="primary" @click="submit()">发布</u-button>
				<view style="height:25rpx;"></view>

				<u-checkbox size="24" label-size="24" v-model="check">
					阅读并同意<text style="color:#007AFF;">《用户隐私》和《用户协议》</text>
				</u-checkbox>
			</view>
		</view>
		<u-toast ref="uToast" />
	</view>
</template>
<script>
	export default {
		data() {
			return {
				form: {
					taskTypeId: "",
					taskTypeName: ""
				},
				action: "http://8.155.28.7:9001/sys/annex/fastDFSUploadImg",
				rules: [],
				check: false
			}
		},
		onLoad(data) {
			this.$set(this.form, "taskTypeId", data.id)
			this.$set(this.form, "taskTypeName", data.title)
			console.log(data)
		},
		methods: {
			// 提交表单
			submit() {
				if (!this.check) {
					this.$refs.uToast.show({
						title: '请阅读勾选《用户协议》'
					})
					return
				}
				let files = []
				this.$refs.uUpload.lists.forEach(element => {
					files.push(element.response.filePath)
				})
				if (!!!this.form.taskAddress) {
					this.$refs.uToast.show({
						title: '请输入工地位置'
					})
					return
				}
				if (!!!this.form.contacts) {
					this.$refs.uToast.show({
						title: '请输入联系人'
					})
					return
				}
				if (!!!this.form.mobile) {
					this.$refs.uToast.show({
						title: '请输入联系方式'
					})
					return
				}
				if (files.length == 0) {
					this.$refs.uToast.show({
						title: '请上传工地图片'
					})
					return
				}
				this.$set(this.form, "taskPicture", files.join())
				this.$set(this.form, "taskNumber", new Date().getTime())
				this.$set(this.form, "auditState", 2) // 审核状态 1待审核 2已通过 3不通过
				this.$set(this.form, "taskState", 1) // 任务装填 1待接单 2施工中 3已完工 4已评价 9已删除
				this.$u.api.taskAdd(this.form).then(res => {
					if (res.code == 200) {
						uni.showToast({
							title: '发布成功！',
						});
						this.check = false
						this.form = {}
						this.$refs.uUpload.clear()
						uni.redirectTo({
							url: '/pages/publish/success?id=' + res.id
						});
					}
				})
			},
			// 选择定位
			chooseLocation() {
				let that = this
				uni.chooseLocation({
					success: function(res) {
						that.$set(that.form, "taskAddress", res.address)
					},
					fail: function(err) {
						console.log(err, "出错")
					}
				});
			}
		}
	}
</script>

<style lang="scss" scoped>
	.page {
		min-height: 100%;
		background-color: #fff;
		font-size: 28rpx;
		color: #222;
	}

	.gongzhong_class {
		margin: 0 40rpx;
	}

	.wrap {
		margin: 20rpx 40rpx 0 40rpx;

	}
</style>
